<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>后台登录</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
</head>

<body style="background:#1e9fff;">
    <div
        style="position:absolute;left:50%;width:480px;top:50%;margin-left:-240px;background:#fff;margin-top:-200px;padding:20px;">
        <div class="layui-form">
            @csrf
            <div style="font-size:16px;">通用后台管理系统</div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">用户名：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="username" id="username">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">密码：</label>
                <div class="layui-input-block">
                    <input type="password" class="layui-input" name="pwd" id="password">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">验证码：</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" name="vericode" id="vericode">
                </div>
                <img src="/admins/account/captcha" onclick="reload_captcha()" id="captcha" alt=""
                    style="width:100px;height:30px;">
            </div>

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" onclick="dologin()">登录</button>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="/layui/layui.js"></script>

<script>
    layui.use(['layer'], function() {
        $ = layui.jquery;
    });


    function reload_captcha() {
        $("#captcha").attr("src", '/admins/account/captcha?rand=' + Math.random());
    }


    function dologin() {
        var username = $.trim($("#username").val());
        var password = $.trim($("#password").val());
        var vericode = $.trim($("#vericode").val());
        var _token = $("input[name='_token']").val();
        if (username == "" || password == "" || vericode == "") {
            layer.alert("用户名或者密码不正确", {
                icon: 2
            })
        }

        $.post('/admins/account/dologin', {
            username,
            password,
            vericode,
            _token
        }, function(res) {
            if (res.code > 0) {
                layer.alert(res.msg, {
                    icon: 2
                });
            }

            layer.msg(res.msg);
            setTimeout(() => {
                window.location.href = "/admins/home/index";
            }, 1000);
        }, 'json');
    }

</script>

</html>
